import 'package:base_flutter/base_flutter.dart';
import 'package:fan_da_app/res/drawables.dart';
import 'package:fan_da_app/ui/main_page.dart';
import 'package:fan_da_app/widget/receipt_constrained_box.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter/src/widgets/framework.dart';
import 'package:flutter_svg/svg.dart';
import 'package:print_image_generate_tool/print_image_generate_tool.dart';

import '../view_model/login_view_model.dart';

class LoginPage extends BaseStatefulMvvmWidget {
  @override
  State<StatefulWidget> createState() => _LoginState();
}

class _LoginState extends BaseMvvmState<LoginViewModel, LoginPage> {
  @override
  Widget? buildLoadingContentView() {
    return Stack(
      children: [
        Container(
          decoration: BoxDecoration(
              gradient: LinearGradient(
                  colors: [Colors.amber, Colors.amber[200]!],
                  begin: Alignment.topLeft,
                  end: Alignment.bottomRight)),
          height: 350,
        ).setLocation(
          top: 0,
          left: 0,
          right: 0,
        ),
        (viewModel.currentStep==0?loginContent():registerContent()).setLocation(bottom: 0, top: 270, left: 0, right: 0),
        SvgPicture.asset(sweet_love)
            .addToContainer(height: 300)
            .setLocation(top: 30, left: 0, right: 0),
      ],
    );
  }

  Widget loginContent() {
    return Column(
      children: [
        CommonInput(
          hintText: '请输入账号....',
          maxLines: 1,
          clearWidget: Icon(
            Ionicons.close_circle,
            size: 17,
          ),
          needClear: true,
          headWidget: SvgPicture.asset(
            icon_account,
            width: 26,
            height: 26,
          ).addToContainer(margin: EdgeInsets.only(right: 10)),
        ),
        SizedBox(
          height: 12,
        ),
        CommonInput(
          hintText: '请输入密码....',
          showPassword: true,
          needClear: true,
          maxLines: 1,
          visiblePasswordWidget: Icon(
            Icons.remove_red_eye,
            size: 17,
          ),
          hidePasswordWidget: Icon(
            Ionicons.eye_off,
            size: 17,
          ),
          keyboardType: CommonInputType.password,
          clearWidget: Icon(
            Ionicons.close_circle,
            size: 17,
          ),
          headWidget: SvgPicture.asset(
            icon_password,
            width: 26,
            height: 26,
          ).addToContainer(margin: EdgeInsets.only(right: 10)),
        ),
        SizedBox(
          height: 20,
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.spaceBetween,
          children: [
            Text(
              '注册账号',
              style: TextStyle(color: mainColor[700]),
            ).onTap(() {
              viewModel.registerClick();
            }),
            Text(
              "忘记密码？",
              style: TextStyle(color: mainColor[700]),
            )
          ],
        ),
        SizedBox(
          height: 50,
        ),
        ElevatedButton(
          onPressed: () {
            Go().pushAndPop(MainPage());
          },
          child: CommonText('登  录', textColor: Colors.white),
          style: ButtonStyle(
              backgroundColor: MaterialStateProperty.all(mainColor),
              shape: MaterialStateProperty.all(StadiumBorder()),
              minimumSize: MaterialStateProperty.all(
                  Size(MediaQuery.of(context).size.width - 32, 45))),
        )
      ],
    ).addToContainer(
        padding: EdgeInsets.only(left: 40, right: 40, top: 50),
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.vertical(top: 20.radius)));
  }

  Widget registerContent() {
    return Column(
      children: [
        CommonInput(
          hintText: '请输入账号....',
          maxLines: 1,
          clearWidget: Icon(
            Ionicons.close_circle,
            size: 17,
          ),
          needClear: true,
          headWidget: SvgPicture.asset(
            icon_account,
            width: 26,
            height: 26,
          ).addToContainer(margin: EdgeInsets.only(right: 10)),
        ),
        SizedBox(
          height: 12,
        ),
        CommonInput(
          hintText: '请输入密码....',
          showPassword: true,
          needClear: true,
          maxLines: 1,
          visiblePasswordWidget: Icon(
            Icons.remove_red_eye,
            size: 17,
          ),
          hidePasswordWidget: Icon(
            Ionicons.eye_off,
            size: 17,
          ),
          keyboardType: CommonInputType.password,
          clearWidget: Icon(
            Ionicons.close_circle,
            size: 17,
          ),
          headWidget: SvgPicture.asset(
            icon_password,
            width: 26,
            height: 26,
          ).addToContainer(margin: EdgeInsets.only(right: 10)),
        ),

        SizedBox(
          height: 12,
        ),
        CommonInput(
          hintText: '请再次输入密码....',
          showPassword: true,
          needClear: true,
          maxLines: 1,
          visiblePasswordWidget: Icon(
            Icons.remove_red_eye,
            size: 17,
          ),
          hidePasswordWidget: Icon(
            Ionicons.eye_off,
            size: 17,
          ),
          keyboardType: CommonInputType.password,
          clearWidget: Icon(
            Ionicons.close_circle,
            size: 17,
          ),
          headWidget: SvgPicture.asset(
            icon_password,
            width: 26,
            height: 26,
          ).addToContainer(margin: EdgeInsets.only(right: 10)),
        ),

        SizedBox(
          height: 50,
        ),
        ElevatedButton(
          onPressed: () {
            Go().pushAndPop(MainPage());
          },
          child: CommonText('注  册', textColor: Colors.white),
          style: ButtonStyle(
              backgroundColor: MaterialStateProperty.all(mainColor),
              shape: MaterialStateProperty.all(StadiumBorder()),
              minimumSize: MaterialStateProperty.all(
                  Size(MediaQuery.of(context).size.width - 32, 45))),
        ),
        SizedBox(height: 20,),
        Text('已有账户？前去登录',style: TextStyle(color: Colors.grey),).onTap(() {
          viewModel.toLoginClick();
        })
      ],
    ).addToContainer(
        padding: EdgeInsets.only(left: 40, right: 40, top: 50),
        decoration: BoxDecoration(
            color: Colors.white,
            borderRadius: BorderRadius.vertical(top: 20.radius)));
  }

  @override
  Widget buildRootView(BuildContext context, Widget loadingContentWidget) {
    return Scaffold(
      backgroundColor: Colors.white,
      body: loadingContentWidget,
      resizeToAvoidBottomInset: false,
    );
  }

  @override
  LoginViewModel createViewModel() {
    return LoginViewModel(context);
  }

  @override
  void onRetryClick() {}
}
